<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>

<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<c:set var="ctx" value="${pageContext.request.contextPath}${adminPath}"/>
<c:set var="ctxStatic" value="${pageContext.request.contextPath}/static/hplus"/>
    
<!DOCTYPE html>
<html>
 <head> 
  <meta charset="utf-8"> 
  <meta name="viewport" content="width=device-width, initial-scale=1.0"> 
  <title>后台管理系统 - 登录</title> 
  <meta name="keywords" content="后台管理系统"> 
  <meta name="description" content="后台管理系统"> 
  <link rel="shortcut icon" href="${ctxStatic}/static/favicon.ico"> 
  <link href="${ctxStatic}/css/bootstrap.min.css?v=3.3.5" rel="stylesheet"> 
  <link href="${ctxStatic}/css/font-awesome.min.css?v=4.4.0" rel="stylesheet"> 
  <link href="${ctxStatic}/css/animate.min.css" rel="stylesheet"> 
  <link href="${ctxStatic}/css/style.min.css?v=4.0.0" rel="stylesheet">
  <base target="_blank"> 

  <script>if(window.top !== window.self){ window.top.location = window.location;}</script> 
 </head> 
 <body class="gray-bg"> 
  <div class="middle-box text-center loginscreen  animated fadeInDown"> 
   <div> 
    <div> 
     <h1 class="logo-name">H+</h1> 
    </div> 
    <h3>欢迎使用后台管理系统</h3> 
    <form class="m-t" role="form" id="loginForm"> 
     <div class="form-group">
      <input type="text" name="loginName" id="loginName" value="admin" class="form-control" placeholder="用户名"> 
     </div> 
     <div class="form-group">
      <input type="password" name="password" id="password" value="123456" class="form-control" placeholder="密码"> 
     </div> 
     <!-- 
     <div class="form-group form-inline text-left">
	  <input type="text" name="loginCaptcha" id="loginCaptcha" class="form-control" placeholder="验证码">
	  <input type="hidden" name="captchaName" value="loginCaptcha">
	  <img src="${ctx}/captcha?captchaName=loginCaptcha" id="loginCaptchaImg" alt="点击刷新验证码" onclick="javascript:this.src='${ctx}/captcha?captchaName=loginCaptcha&t='+new Date().getTime();" />
     </div> 
      -->
     <div class="form-group"> 
     	<p class="text-danger text-left"></p>
     </div> 
     <button type="submit" id="loginBtn" class="btn btn-primary block full-width m-b">登 录</button> 
     <p class="text-muted text-center"> <a href="login.html#"><small>忘记密码了？</small></a> | <a href="${ctx}/register.html">注册一个新账号</a> </p> 
    </form> 
   </div> 
  </div> 
<script src="${ctxStatic}/js/jquery.min.js?v=2.1.4"></script> 
<script src="${ctxStatic}/js/bootstrap.min.js?v=3.3.5"></script>
<script src="${ctxStatic}/js/plugins/validate/jquery.validate.min.js"></script> 
<script src="${ctxStatic}/js/plugins/validate/messages_zh.min.js"></script> 
<script src="${ctxStatic}/js/plugins/jquery-form/jquery.form.min.js"></script> 
<script type="text/javascript">
$(document).ready(function(){
	var e = "<i class='fa fa-times-circle'></i> ";
	$("#loginForm").validate({
		rules : {
			loginName : {
				required : !0,
				minlength : 1,
				maxlength : 10
			},
			password : {
				required : !0,
				digits: !0,
				minlength : 1,
				maxlength : 6
			},
			loginCaptcha : {
				required : !0,
				minlength : 4,
				maxlength : 4
			}
		},
		messages : {
			loginName : {
				required : e + "请输入用户名",
				minlength : e + "用户名必须1个或1个字符以上", 
				maxlength : e + "用户名最多10个字符"
			},
			password : {
				required : e + "请输入密码",
				minlength : e + "密码必须1个或1个字符以上",
				maxlength : e + "密码最多6个字符"
			},
			loginCaptcha : {
				required : e + "请输入验证码",
				minlength : e + "验证码必须4个字符",
				maxlength : e + "验证码最多4个字符"
			}
		},
		submitHandler: function(form){
			$(form).ajaxSubmit({
				type: "POST",
				dataType: "json",
				url: "${ctx}/doLogin",
				success: function(data){
					if(!data.success){
						$(".text-danger").text(data.msg);
						$("#loginCaptchaImg").trigger("click");
					}else{
						window.location.href = "${ctx}";
					}
				},
				error: function(data){
					$(".text-danger").text("登录发生错误！");
				}
			});
		}
	}), $("#name").focus();
})	
 </script>
 </body>
</html>
